<div class="page">      


    <!-- Bullet -->
    <section class="panel panel-default">
        <div class="panel-heading"><span class="glyphicon glyphicon-th"></span> Bullet</div>
        <div class="panel-body">
            <div class="divider divider-lg"></div>

            <div class="row">
                <div class="col-md-4">
                    <div class="ui-bullet">
                        <div class="btn-icon btn-icon-round btn-icon-lg bg-primary">
                            <i class="ti-cut"></i>
                        </div>
                        <div class="ui-bullet-content">
                            <h3>This Bullet Title</h3>
                            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deleniti, nesciunt, eius accusamus quam quaerat molestiae voluptas dignissimos tempora non veniam. Sint libero quia repellendus eveniet dolores distinctio amet consectetur suscipit.</p>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="ui-bullet">
                        <div class="btn-icon btn-icon-round btn-icon-lg bg-info">
                            <i class="ti-stats-up"></i>
                        </div>
                        <div class="ui-bullet-content">
                            <h3>Another Bullet Title</h3>
                            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deleniti, nesciunt, eius accusamus quam quaerat molestiae voluptas dignissimos tempora non veniam. Sint libero quia repellendus eveniet dolores distinctio amet consectetur suscipit.</p>
                        </div>
                    </div>                    
                </div>
                <div class="col-md-4">
                    <div class="ui-bullet">
                        <div class="btn-icon btn-icon-round btn-icon-lg bg-danger">
                            <i class="ti-image"></i>
                        </div>
                        <div class="ui-bullet-content">
                            <h3>Last Bullet Title</h3>
                            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deleniti, nesciunt, eius accusamus quam quaerat molestiae voluptas dignissimos tempora non veniam. Sint libero quia repellendus eveniet dolores distinctio amet consectetur suscipit.</p>
                        </div>
                    </div>                    
                </div>
            </div>

            <div class="divider divider-lg"></div>
        </div>
    </section>
    <!-- end Bullet -->


    <div class="panel panel-default">
        <div class="panel-heading"><span class="glyphicon glyphicon-th"></span> Icon Boxes</div>
        <div class="panel-body">

            <div class="row">
                <div class="col-md-3">
                    <article class="icon-box icon-box-vertical">
                        <div class="icon-container">
                            <span class="ti-rocket"></span>
                        </div>
                        <div class="desc-container">
                            <h4>Lorem Ipsum</h4>
                            <div class="desc">Dolor sit amet, id possimus consectetur adipisicing elit.</div>
                        </div>
                    </article>
                </div>
                <div class="col-md-3">
                    <article class="icon-box icon-box-vertical">
                        <div class="icon-container">
                            <span class="ti-palette"></span>
                        </div>
                        <div class="desc-container">
                            <h4>Nihil Ipsa</h4>
                            <div class="desc">Cumque placeat beatae unde quas, nam quisquam perspiciatis</div>
                        </div>
                    </article>                    
                </div>
                <div class="col-md-3">
                    <article class="icon-box icon-box-vertical">
                        <div class="icon-container">
                            <span class="ti-pulse"></span>
                        </div>
                        <div class="desc-container">
                            <h4>Quod Nostrum</h4>
                            <div class="desc">Doloribus velit saepe obcaecati quisquam fugiat blanditiis!</div>
                        </div>
                    </article>                    
                </div>
                <div class="col-md-3">
                    <article class="icon-box icon-box-vertical">
                        <div class="icon-container">
                            <span class="ti-files"></span>
                        </div>
                        <div class="desc-container">
                            <h4>Minima Vitae</h4>
                            <div class="desc">Obcaecati dolor sit amet, consectetur adipisicing elit.</div>
                        </div>
                    </article>                    
                </div>
            </div>

            <div class="divider divider-xl"></div>
            <div class="divider divider-lg"></div>
            <div class="row">
                <div class="col-md-4">
                    <article class="icon-box icon-box-horizontal">
                        <div class="icon-container">
                            <span class="ti-headphone"></span>
                        </div>
                        <div class="desc-container">
                            <h4>Beatae Ipsa</h4>
                            <div class="desc">Cumque placeat beatae unde quas, nam quisquam perspiciatis</div>
                        </div>
                    </article>                         
                </div>
                <div class="col-md-4">
                    <article class="icon-box icon-box-horizontal">
                        <div class="icon-container">
                            <span class="ti-game"></span>
                        </div>
                        <div class="desc-container">
                            <h4>Obcaecati Vitae</h4>
                            <div class="desc">Obcaecati dolor sit amet, consectetur adipisicing elit.</div>
                        </div>
                    </article>                    
                </div>
                <div class="col-md-4">
                    <article class="icon-box icon-box-horizontal">
                        <div class="icon-container">
                            <span class="ti-package"></span>
                        </div>
                        <div class="desc-container">
                            <h4>Doloribus velit</h4>
                            <div class="desc">Doloribus velit saepe obcaecati quisquam fugiat blanditiis!</div>
                        </div>
                    </article>                     
                </div>
            </div>
            <div class="divider divider-xl"></div>

        </div>
    </div>


    <div class="panel panel-default">
        <div class="panel-heading"><span class="glyphicon glyphicon-th"></span> Meida Boxes</div>
        <div class="panel-body">

            <div class="row">
                <div class="col-md-4">
                    <article class="media-box">
                        <div class="media-box-photo">
                            <img src="images/assets/600_400-1.jpg" alt="">
                        </div>
                        <div class="media-box-body">
                            <a class="profile-img pull-right" href=""><img src="images/g1.jpg" alt=""></a>
                            <h5><a href="">Quod Nostrum Consequatur</a></h5>
                            <div class="text-muted">
                                <p>Quisquam beatae, consequatur maiores iure, deserunt blanditiis, autem architecto maxime nam. Dicta nihil laudantium nulla.</p>
                            </div>
                        </div>
                    </article>                      
                </div>
                <div class="col-md-4">
                    <article class="media-box">
                        <div class="media-box-photo">
                            <img src="images/assets/600_400-2.jpg" alt="">
                        </div>
                        <div class="media-box-body">
                            <a class="profile-img pull-right" href=""><img src="images/g1.jpg" alt=""></a>
                            <h5>Quod Nostrum Fugiat</h5>
                            <div class="text-muted">Doloribus velit saepe obcaecati quisquam fugiat blanditiis, velit saepe obcaecati quisquam fugiat blanditiis!</div>
                        </div>
                    </article>                      
                </div>
                 <div class="col-md-4">
                    <article class="media-box">
                        <div class="media-box-photo">
                            <img src="images/assets/600_400-3.jpg" alt="">
                        </div>
                        <div class="media-box-body">
                            <a class="profile-img pull-right" href=""><img src="images/g1.jpg" alt=""></a>
                            <h5>Quod Nostrum Saepe</h5>
                            <div class="text-muted">Doloribus velit saepe obcaecati quisquam fugiat blanditiis! Voluptatum similique architecto nisi eos.</div>
                        </div>
                    </article>                      
                </div>
            </div>

        </div>
    </div>
    
<!-- 
    <div class="panel panel-default">
        <div class="panel-heading"><span class="glyphicon glyphicon-th"></span> Photo Boxes</div>
        <div class="panel-body">

            <div class="row">
                <div class="col-md-4">
                    <article class="photo-box">
                        <div class="photo-container">
                            <div class="mask"></div>
                            <img src="images/assets/600_400-1.jpg" alt="">
                        </div>
                        <div class="desc-container">
                            <h4>Quod Nostrum</h4>
                            <div class="desc">
                                <p>Quisquam beatae, consequatur maiores iure, deserunt blanditiis, autem architecto maxime nam. Dicta nihil laudantium nulla.</p>
                            </div>
                        </div>
                    </article>                      
                </div>
                <div class="col-md-4">
                    <article class="photo-box">
                        <div class="photo-container">
                            <div class="mask"></div>
                            <img src="images/assets/600_400-2.jpg" alt="">
                        </div>
                        <div class="desc-container">
                            <h4>Quod Nostrum</h4>
                            <div class="desc">Doloribus velit saepe obcaecati quisquam fugiat blanditiis, velit saepe obcaecati quisquam fugiat blanditiis!</div>
                        </div>
                    </article>                      
                </div>
                 <div class="col-md-4">
                    <article class="photo-box">
                        <div class="photo-container">
                            <div class="mask"></div>
                            <img src="images/assets/600_400-3.jpg" alt="">
                        </div>
                        <div class="desc-container">
                            <h4>Quod Nostrum</h4>
                            <div class="desc">Doloribus velit saepe obcaecati quisquam fugiat blanditiis! Voluptatum similique architecto nisi eos.</div>
                        </div>
                    </article>                      
                </div>
            </div>

        </div>
    </div>
 -->

</div>